import React from 'react'
// ===================================================================== Temp
import SubmitForm from '#cpt/temp/SubmitForm'
import Controls from '#cpt/temp/Controls'
import Confirm from '#cpt/temp/Confirm'
// ===================================================================== global declare
const { $fn, $Lazy, $http } = window
// ===================================================================== private component
const Page 		= $Lazy.load(()=>import('#tp/page/page-container-scroll'))
const Box		= $Lazy.load(()=>import('#tp/box/box'))
const message 	= $Lazy.file(()=>import('@antd/message'))
const $cache 	= $Lazy.file(()=>import('#private/cache-api'))
// ===================================================================== table
const ProjectDetailTable = $Lazy.state(()=>import('./table/project-detail'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		// 提交表单列表
		formData : [
			{ label: '项目中文名称',		name: 'kind_name', 				half:true, required:true, title:'项目信息'},
			{ label: '中文简称',			name: 'short_name', 			half:true },
			{ label: '项目英文名称',		name: 'name_en', 				half:true },
			{ label: '英文简称',			name: 'name_short_en', 			half:true },
			{ label: '组合项目代码',		name: 'kind_code', 				half:true, disabled:true },
			{ label: '项目助记码',		name: 'debit_code', 		half:true },
			{ label: '绑定医院',			name: 'hosp_id',			half:true, 	type:'select', loading:true },
		],
		offTips: {
			comb: [],
			market: [],
			single: [],
			sub: []
		}
	}
	
	componentDidMount(){
		const { kind_id } = $fn.query()
		this.submit = { kind_id }
		this.kind_id = kind_id
		this.setState({ kind_id })
		this.getSelect()
	}
	
	// 获取下拉数据
	getSelect = () => {
		const { formData } = this.state
		
		$cache.then( async f => {
			// 绑定医院
			$fn.setRow( formData, 'hosp_id',  await f.getCache({ api: 'hospital' }) )
			//
			this.setState({ formData })
		})
	}
	
	fetch = () => {
		$http.submit(null,'kd-market/info', { param:{kind_id:this.kind_id}, isPull:true } ).then((data)=>{
			this.formRef.setValue(data)
			this.setState({ edit: +data['kind_status'] === 2 })
		})
		$http.submit(null, 'kind-info/offTips', { param:{kind_id:this.kind_id} }).then(data => this.setState({offTips: data}))
	}
	
	// 操作按钮
	controls = () => {
		const query = { kind_id: this.kind_id }
		const { edit } = this.state
		if( edit === true){
			const { comb, market, single, sub } = this.state.offTips
			return [
				Confirm.call(this, '下架', 'kind-info/off', { param:this.kind_id, idStr:'kind_id', msg:
					<div>
					<span>{ single.length || sub.length || comb.length || market.length ? <span style={{color: 'red'}}>该项目下架，以下关联项目也将会被下架！</span> : '确认下架？' }</span><br />
						{ single.length ? <div>单一项目:【{single.join(',')}】<br /></div> : '' }
						{ sub.length ? <div>从属项目:【{sub.join(',')}】<br /></div> : '' }
						{ comb.length ? <div>组合项目:【{comb.join(',')}】<br /></div> : '' }
						{ market.length ? <div>营销项目:【{market.join(',')}】<br /></div> : '' }
					</div>,
					refresh:true, onComplete:()=>{
						this.setState({ edit: false })
				} }),
				Controls.back.call(this, { refresh:true })
			]
		}else if( edit === false){
			return [
				Confirm.call(this,'保存', null, { onMy: ()=> { 
					this.isAudit=false
					this.formRef.submit()
					$fn.dataRemove('specimen-kind/selectkind') 
				}}),
				Confirm.call(this, '审批', 'kd-market/audit', { query }),
				Confirm.call(this,'保存并提交审批', null, { onMy: ()=> { 
					this.isAudit=true
					this.formRef.submit()
					$fn.dataRemove('specimen-kind/selectkind')
				}}),
				Confirm.call(this, '发布', 'kd-market/push', { query }),
				Controls.back.call(this, { refresh:true })
			]
		}else{
			return []
		}
	}
	
	render(){
		const tableStyle = {height:300, padding:'10px 0 10px'}
		const { kind_id } = this
		const { edit } = this.state
		return (
			<Page title='设置营销项目' nobc controls={this.controls()}>
				<Box contentClassName='plr10' first>
					{ 
						SubmitForm.call(this,{ msg:'保存', labelWidth:'s10', api:'kd-market/edit', onForm: this.fetch, disabled:edit, onOk:()=>{
							if(this.isAudit){
								$http.submit(this,'kd-market/audit', { param: { kind_id:this.kind_id } }).then(data=>{
									message.then(f=>f.success('审批成功'))
								})
							}
						}}) 
					}
				</Box>
				{/* 项目明细 */}
				<ProjectDetailTable tableStyle={tableStyle} kind_id={kind_id} disabled={edit} type={'sale'} />
			</Page>	
		)
	}
}

export default Index